@import "@wordpress/base-styles/mixins";
@import "@wordpress/base-styles/breakpoints";


.is-section-stepper {
	.processing {
		.signup-header {
			z-index: 1;
		}
	}
	.newsletter,
	.free,
	.update-design {
		.signup-header {
			.signup-header__right {
				visibility: hidden;
			}
		}

		.processing-step__container {
			height: 100%;
			width: 100%;
			position: fixed;
			top: 0;
			left: 0;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
		}

		.processing-step {
			box-sizing: border-box;
			width: 100%;
			padding: 1em;
			max-width: 540px;
			text-align: center;
			margin: 32vh auto;

			@include break-medium {
				width: 540px;
			}
		}
	}

	.newsletter {
		.processing-step__container {
			background-color: var(--studio-gray-0);
		}

		.wpcom__loading-progress-bar {
			background-color: var(--studio-gray-5);
			&::before {
				background: var(--studio-black);
			}
		}
	}
}
